<template>
  <el-card class="form-container" shadow="never">
    <el-form
      ref="orderSettingForm"
      :model="orderSetting"
      :rules="rules"
      label-width="150px"
    >
      <el-form-item label="秒杀订单超过：" prop="flashOrderOvertime">
        <el-input v-model="orderSetting.flashOrderOvertime" class="input-width">
          <template slot="append">分</template>
        </el-input>
        <span class="note-margin">未付款，订单自动关闭</span>
      </el-form-item>
      <el-form-item label="正常订单超过：" prop="normalOrderOvertime">
        <el-input v-model="orderSetting.normalOrderOvertime" class="input-width">
          <template slot="append">分</template>
        </el-input>
        <span class="note-margin">未付款，订单自动关闭</span>
      </el-form-item>
      <el-form-item label="发货超过：" prop="confirmOvertime">
        <el-input v-model="orderSetting.confirmOvertime" class="input-width">
          <template slot="append">天</template>
        </el-input>
        <span class="note-margin">未收货，订单自动完成</span>
      </el-form-item>
      <el-form-item label="订单完成超过：" prop="finishOvertime">
        <el-input v-model="orderSetting.finishOvertime" class="input-width">
          <template slot="append">天</template>
        </el-input>
        <span class="note-margin">自动结束交易，不能申请售后</span>
      </el-form-item>
      <el-form-item label="订单完成超过：" prop="commentOvertime">
        <el-input v-model="orderSetting.commentOvertime" class="input-width">
          <template slot="append">天</template>
        </el-input>
        <span class="note-margin">自动五星好评</span>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          @click="confirm('orderSettingForm')"
        >提交</el-button>
      </el-form-item>
    </el-form>
  </el-card>
</template>
<script>
// import {getOrderSetting,updateOrderSetting} from '@/api/orderSetting';
const defaultOrderSetting = {
  id: null,
  flashOrderOvertime: 0,
  normalOrderOvertime: 0,
  confirmOvertime: 0,
  finishOvertime: 0,
  commentOvertime: 0
}
const checkTime = (rule, value, callback) => {
  if (!value) {
    return callback(new Error('时间不能为空'))
  }
  console.log('checkTime', value)
  const intValue = parseInt(value)
  if (!Number.isInteger(intValue)) {
    return callback(new Error('请输入数字值'))
  }
  callback()
}
export default {
  name: 'OrderSetting',
  data() {
    return {
      orderSetting: Object.assign({}, defaultOrderSetting),
      rules: {
        flashOrderOvertime: { validator: checkTime, trigger: 'blur' },
        normalOrderOvertime: { validator: checkTime, trigger: 'blur' },
        confirmOvertime: { validator: checkTime, trigger: 'blur' },
        finishOvertime: { validator: checkTime, trigger: 'blur' },
        commentOvertime: { validator: checkTime, trigger: 'blur' }
      }
    }
  },
  created() {
    this.getDetail()
  },
  methods: {
    confirm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$confirm('是否要提交修改?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            // updateOrderSetting(1,this.orderSetting).then(response=>{
            //   this.$message({
            //     type: 'success',
            //     message: '提交成功!',
            //     duration:1000
            //   });
            // })
          })
        } else {
          this.$message({
            message: '提交参数不合法',
            type: 'warning'
          })
          return false
        }
      })
    },
    getDetail() {
      // getOrderSetting(1).then(response=>{
      //   this.orderSetting=response.data;
      // })
    }
  }
}
</script>
<style scoped>
  .input-width {
    width: 50%;
  }

  .note-margin {
    margin-left: 15px;
  }
</style>
